		*{
			margin: 0;
			padding: 0;
		}

/* ??????  part1 */

		.head{
			width: 100%;
			height: 66px;
			position: fixed;
			z-index: 100000;
			border-bottom:1px solid #ddd;
			background-color: white;
		}

		.head-content{
			width: 1300px;
			height: 66px;
			margin: 0 auto;
			background-color: white;
		}

		.logo-img{
			width: 66px;
			height: 66px;
			position:relative;
			top:-1px;

		}

		.logo-text{
			position:relative;
			top:-1px;
		}


		.ul-head{
			width: 888px;
			position: relative;
			left: 320px;
			top: -70px;
			height: 66px;
			list-style: none;

		}

		.ul-head li{
			padding:0px 20px;
			line-height:66px;
			cursor:pointer;
		}


		.ul-head li{
			font-size: 14px;
			float: left;
		}

		.ul-head li:nth-child(1){
			margin-left: 36px;
		}

		.ul-head li:hover{
			background-color:#4f4f4f;
			color:white;
		}

		a:link {
			font-size: 14px;
			color: #000;
			text-decoration: none;
		}
		a:visited {
			font-size: 14px;
			color: #000;
			text-decoration: none;
		}

		a{
			margin: 5px;
		}



/*  ������  */
		.content{
			width: 100%;

		}

		.content-item{
			width: 1140px;
			margin: 0 auto;
			position: relative;
			top: 66px;
			overflow: hidden;
		}

		.main{
			position: absolute;
			left:10px;
			top:10px;
			height: 466px;
			width:1140px;
		}

		.main1{
			position: absolute;
			left:10px;
			top:10px;
			height: 466px;
			width:1140px;
		}



		.content-item1{
			height: 100px;
			width: 100%;
			font-size: 30px;
			text-align: center;
			line-height: 100px;
			margin: 33px 0px;
		}

		.content-item2{
			height: 230px;
			width: 357px;
			margin: 10px 5px 10px 10px;
			background-color: skyblue;
			display: inline-block;
			position: relative;
			left: 0px;
			background-size: 360px 233px;
			opacity: 0.85;
			border:1px solid gray;

		}


		.img1{
			background-image: url(../img/img1.jpg);
		}

		.img2{
			background-image: url(../img/img2.jpg);
		}

		.img3{
			background-image: url(../img/img3.jpg);
		}

		.see{
			font-size: 17px;
			/*color: white;*/
			text-align: center;
			position: relative;
			left :100px;
			font-weight: bolder;
			line-height: 100px;
			cursor:pointer;

		}

		.content-item3{
			height: 160px;
			width: 357px;
			margin: 0px 5px 10px 10px;
			display: inline-block;
			position: relative;
			left: 0px;
			top: -30px;
			border:1px solid gray;
			border-top:0px;
		}

		.look{
			height:28px;
			width:77px;
			cursor: pointer;
			border: 1px solid #000;
			border-radius: 25px;
			text-align: center;
			line-height:28px;
			position: relative;
			left :150px;

		}

		.look:hover{
			border: 1px solid #fff;
			background-color: black;
			color:white;
		}

		.content-item11{
			width:1140px;
			height:666px;
			background:white;

		}

		.course{
			width:270.75px;
			height:250.5px;
			margin-right:13px;
			background:white;
			float:left;
			margin-top:25px;
			background-image:url(../img/course.jpg);
			background-size:273.75px 200px;
			background-repeat:no-repeat;
			border:1px solid gray;
			cursor:pointer;

		}

		.course:hover{
			box-shadow:3px 4px 5px gray;
		}

		.title{
			position:relative;
			top:205.5px;
			font-size:15px;
			margin:5px;
			text-align:center;
			line-height:17px;
		}

		.free{
			position:relative;
			top:205.5px;
			font-size:15px;
			line-height:17px;
			margin-left:197px;
		}


		.ipad{
			width:425px;
			height:425px;
			background-image:url(../img/ipad.png);
			background-size:425px 425px;
			background-repeat:no-repeat;

		}

		.ipad-text{

			width:265px;
			height:285px;
			font-size:19px;
			font-weight:bold;
			text-align: center;
			line-height:2;
			padding:140px 80px 0px;
			color:white;

		}

		.ipad-ul{
			width: 582px;
			height:380px;
			position: relative;
			top: -405px;
			left:540px;
			float:left;
		}

		.ipad-li{
			list-style: none;
			width:118px;
			height:170px;
			margin:10px  38px;
			float:left;
		}

		.ipad-div{
			width: 114px;
		    height: 114px;
		    align-items: center;
		    border-radius: 50%;
		    justify-content:center;
		    display: flex;
		    border:1px solid #000;
		    background-color:#000;

		}

		.ipad-pt{
			position: relative;
    		width: 66px;
		    height: 66px;
		    font-size: 45px;



		}

		.ipad-img1{
		    background-image:url(../img/ipad1.png);
		}
		.ipad-img2{
		    background-image:url(../img/ipad2.png);
		}
		.ipad-img3{
		    background-image:url(../img/ipad3.png);
		}
		.ipad-img4{
		    background-image:url(../img/ipad4.png);
		}
		.ipad-img5{
		    background-image:url(../img/ipad5.png);
		}
		.ipad-img6{
		    background-image:url(../img/ipad6.png);
		}

		.ipad-pb{
			margin-top: 20px;
    		font-size: 16px;
    		text-align: center;
    		font-weight: 500;
		}

		.active{
			color:#000;
			background-color:#fff;
			background-position:66px 0px;
		}


		.ipad-span{
			display:none;
		}


		.teacher-message{
			width:100%;
			height:666px;
		}

		.teacher-center{
			width:1140px;
			height:666px;
			position:relative;
			margin:0px auto;
			/* background:pink; */
			top:28px;

		}

		.teacher-content{
			height: 200px;
			width: 100%;
			font-size: 30px;
			text-align: center;
			line-height: 200px;
		}

		.teacher-ul{
			height:466px;
			width:100%;
			/* background:skyblue; */
			position:absolute;
		}

		.teacher-li:hover{
			box-shadow:0px 3px 8px #ddd;

		}

		.teacher-li:hover>.teacher-follow{
			display:block;

		}

		.teacher-li{
			float:left;
			height:211px;
			width:262px;
			background:transparent;
			list-style:none;
			position:absolute;
			border:1px solid #ddd;


		}

		.teacher-img{
			width:111px;
			height:111px;
			border-radius:50%;
			/* background:yellow; */
			position:absolute;
			top:23px;
			left:75px;
			background-image:url(../img/teacher.png);
			background-size:111px 111px;
			border:1px solid #ddd;
		}

		.teacher-name{
			font-family:KaiTi;
			font-weight:600;
			font-size:23px;
			position:absolute;
			top:150px;
			left:105px;
		}

		.teacher-follow{
			width:66px;
			height:33px;
			background:#444;
			text-align:center;
			line-height:33px;
			color:#fff;
			position:absolute;
			top:150px;
			left:105px;
			cursor:pointer;
			display:none;

		}

		.p1{
			top:15px;
			left:15px;
		}

		.p2{
			top:15px;
			left:300px;
		}

		.p3{
			top:15px;
			left:580px;
		}

		.p4{
			top:15px;
			left:861px;
		}

		.p5{
			top:241px;
			left:15px;
		}

		.p6{
			top:241px;
			left:300px;
		}

		.p7{
			top:241px;
			left:580px;
		}

		.p8{
			top:241px;
			left:861px;
		}








/* ?ײ? */

		.No7{
			width: 100%;
			height: 300px;
			background:#070e23;
			position:relative;
			top:30px;

		}

		.No7-1{
			width: 1140px;
			height: 188.8px;
			margin:0px auto;
			position:relative;
			top:30px;
			background:#070e23;
		}

		.map{
			width: 684px;
			height: 188.8px;

			position:relative;
			top:30px;

		}

		.map dl{
		    font-size: 16px;
		    float: left;
		    text-align: center;
		}

		.No7-1-1{
			width: 171px;
			height: 108.8px;
		}

		.map dt{
			margin-bottom: 16px;
			color: white;
			font-size: 18px;
		}


		.map dd,.map a{
			line-height: 32px;
			font-size: 16px;
			text-align: center;
			cursor: pointer;
			color:gray;

		}

		.map dd:hover{
			font-weight:500;
			color:white;

		}

		.map a:hover{
			font-weight:500;
			color:white;

		}

		.No7-1-2{
			width: 171px;
			height:108.8px;

		}

		.No7-1-3{
			width: 171px;
			height: 108.8px;

		}

		.No7-1-4{
			width: 171px;
			height: 108.8px;

		}


		.bottom{
			width: 1140px;
			height: 66px;
			position: relative;
			top:30px;
			margin:0 auto;
			font-size: 12px;
		    line-height: 2.4;

		}

		.bottom-2{
			width: 1120px;
			height: 28.8px;
			text-align: left;


		}

		.bottom-2 span{
			margin:0px 25px;
			color:gray;
		}


		.bottom-2 span:hover{
			cursor: pointer;
			color: #fff;
		}


		.left-logo{
			width:314px;
			height:108px;
			position:relative;
			left:733px;
			background:white;


		}





/* ?????? part2 */

		.head-right{
			height: 66px;
			width: 360px;
			position: relative;
			top: -140px;
			left: 890px;
			text-align: center;
			line-height: 66px;
			font-size: 14px;

		}

		.open li{
			cursor:pointer;
			height:66px;
			width:47px;
			float:left;
			font-size:14px;
			text-align: center;
			line-height: 66px;
		}

		.portrait{
			width:55px;
			height:55px;
			border-radius:50%;
			position:absolute;
			right:0px;
			border-radius:50%;
			cursor:pointer;
			top:10px;
		}



/* ???????????*/

		.dLogin{
			position:relative;
			height:165px;
			width:130px;
			background:white;
			left:885px;
			top:-143px;
			display:none;

		}

		.dRegister{
			position:relative;
			height:110px;
			width:130px;
			background:white;
			left:975px;
			top:-143px;
			display:none;
		}

		.dLogin-ul,.dRegister-ul,.open{
			list-style:none;
		}

		.dLogin-ul li,.dRegister-ul li{
			cursor:pointer;
			height:55px;
			width:130px;
			float:left;
			font-size:14px;
			text-align: center;
			line-height: 55px;

		}

		.dLogin-ul li:hover,.dRegister-ul li:hover{
			background-color:#4f4f4f;
			color:white;
		}


		.dPersonal{
			position:absolute;
			height:55px;
			width:130px;
			background:white;
			left:1276px;
			top:57px;
			display:none;

		}

		.dPersonal-div{
			cursor:pointer;
			height:55px;
			width:130px;
			float:left;
			font-size:14px;
			text-align: center;
			line-height: 55px;
		}

		.dPersonal-div:hover{
			background-color:#4f4f4f;
			color:white;
		}

		.tPersonal{
			position:absolute;
			height:55px;
			width:130px;
			background:white;
			left:1276px;
			top:57px;
			display:none;

		}

		.tPersonal-div{
			cursor:pointer;
			height:55px;
			width:130px;
			float:left;
			font-size:14px;
			text-align: center;
			line-height: 55px;
		}

		.tPersonal-div:hover{
			background-color:#4f4f4f;
			color:white;
		}

		.mPersonal{
			position:absolute;
			height:55px;
			width:130px;
			background:white;
			left:1276px;
			top:60px;
			display:none;

		}

		.mPersonal-div{
			cursor:pointer;
			height:55px;
			width:130px;
			float:left;
			font-size:14px;
			text-align: center;
			line-height: 55px;
		}

		.mPersonal-div:hover{
			background-color:#4f4f4f;
			color:white;
		}
		



		

